import { useRoutes } from 'react-router-dom';
import Head from './components/Head/head';
import Bottom from './components/Bottom/bottom';
import routes from './router';
import './globalCss.css'
import store from './store'
import {setWebInfo} from './store/actions/web_action'

import { useEffect } from 'react';
import { getWebInfo } from './api/web';
import common from  './assets/css/common.module.css'

function App() {
  const elements = useRoutes(routes)
  useEffect(() => {
    getWebInfo().then(res=>{
      store.dispatch(setWebInfo(res))
      localStorage.setItem('webInfo',JSON.stringify(res))
    })
  })
  return (
    <div className="App">
      <div className={common.fixHeader}>
        <Head />
      </div>
      <div className={common.fixContent}>
      {elements}
      </div>
      <Bottom/>
      
    </div>
  );
}

export default App;
